<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>字体图标</title>
    <!--图标地址http://fontawesome.dashgame.com/#basic-->
    <link href="//netdna.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">

</head>
<body>
    <i class="fa fa-camera-retro"></i>fa-camera-retro
    <i class="fa fa-address-book"></i>
</body>
</html>



<!--
CDN: Content Delivery Network,既内容分发网络。之前我们写的CSS都是引用本地，以后使用别人的CSS代码时,一种方式是复制别人的代码到自己的项目，但更简便的方式是请求别人的服务器随网页在线下和加载，但在线请求网站服务器css，js资源仍有问题，服务器压力比较大、离得远的服务器传输速度慢。CDN应运而生，原理是服务器上比较常用的CSS，js资源缓存到全国各个cdn服务器节点，当某个人访问网站时，会从最近的cdn节点获取数据，从而提升访问速度。

后缀.min.css: .min.css .min.js 由于网络传输速度要求,开发完css js代码会先去除空格，把代码缩成一行，再放到生成

(了解)图片格式:png无损图片，画质好但大，支持同名，jpg，有损压缩，体积大大减少画质轻度损耗，gif更好的压缩格式、支持动图多帧。网速慢时先加载一部分。
(了解) 字体图标: 原来网页中的图标都是先用ps之类的工具做好jpg、png格式图片再插入网页中，而现在一些网页图标的源代码使用i标签(字体)插入的。电脑中的字体，例如微软雅黑，是事先定义好的  由数据算法绘制出来的矢量图形。 所以人们用做矢量字体的方式做了一套图标，在网页中i标签插入  定义class对应不同图标代码。字体图标的好处是体积小，放大缩小不失真
(了解)SVG：矢量图标，有html代码定义，除了体积小，放大缩小不失真的优点，功能比字体图标更加复杂，可以复杂图表，缺点学习成本高预览不方便。
-->